<template>
  <div>
    <main-page></main-page>
  </div>
</template>

<script>
// import TodoLists from "./components/todoLists/TodoLists";
// import School from "./components/School/School";
// import animation from "./components/animation/animation";
// import transform from "./components/animation/transform";
// import TransformGroup from "./components/animation/TransformGroup";
// import AnimationThirdParty from "./components/animation/AnimationThirdParty";
// import HttpRequest from "./components/ajax/HttpRequest";
// import Category from "./components/ScopedSlot/Category";
// import VuexOne from "./components/VuexOne/VuexOne";
import MainPage from "./components/routers/MainPage";
export default {
  name: 'App',
  components:{MainPage},
}
</script>

<!--<style>-->
<!--  /*base*/-->
<!--  body {-->
<!--    background: #fff;-->
<!--  }-->

<!--  .btn {-->
<!--    display: inline-block;-->
<!--    padding: 4px 12px;-->
<!--    margin-bottom: 0;-->
<!--    font-size: 14px;-->
<!--    line-height: 20px;-->
<!--    text-align: center;-->
<!--    vertical-align: middle;-->
<!--    cursor: pointer;-->
<!--    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);-->
<!--    border-radius: 4px;-->
<!--  }-->

<!--  .btn-danger {-->
<!--    color: #fff;-->
<!--    background-color: #da4f49;-->
<!--    border: 1px solid #bd362f;-->
<!--  }-->

<!--  .btn-danger:hover {-->
<!--    color: #fff;-->
<!--    background-color: #bd362f;-->
<!--  }-->

<!--  .btn:focus {-->
<!--    outline: none;-->
<!--  }-->

<!--  .todo-container {-->
<!--    width: 600px;-->
<!--    margin: 0 auto;-->
<!--  }-->

<!--  .todo-container .todo-wrap {-->
<!--    padding: 10px;-->
<!--    border: 1px solid #ddd;-->
<!--    border-radius: 5px;-->
<!--  }-->
<!--</style>-->
